<?php
  session_start();

  if(!isset($_SESSION['isLogged'])){
    header('Location: index.php');
  }
  $now=time();
  if($now>$_SESSION['expired']){
    session_unset();
    session_destroy();
    header('Location: index.php');
  }

?>

<html>
<head>
  <title>[eCuti] RUH Pengartuan Cuti</title>
    <link rel="shortcut icon" href="images/users.ico" type="image/x-icon"> 
  <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  <link rel="stylesheet" href="css/pager.css">
    <link href="css/button.css" type="text/css" rel="stylesheet">
  <link href="css/tab.webfx.css" type="text/css" rel="stylesheet">
  <link href="css/calendar.css" type="text/css" rel="stylesheet">
  <script type="text/javascript" src="js/foredit.js"></script>
    <script type="text/javascript" src="js/forpager.js"></script>
  <script type="text/javascript" src="js/tabpane.js"></script>
  <script type="text/javascript" src="js/calendar.js"></script>
  <script type="text/javascript" src="js/calendar-id.js"></script>
  <script type="text/javascript" src="js/calendar-setup.js"></script>
</head>
<body leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0">

<script type="text/javascript" src="js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="js/jquery.dimensions.js"></script>
<script type="text/javascript" src="js/jquery.positionBy.js"></script>
<script type="text/javascript" src="js/jquery.jdMenu.js"></script>
<script type="text/javascript" src="js/ecuti.js"></script>

<link rel="stylesheet" href="css/jquery.jdMenu.css" type="text/css">
<div id="banner">
  <img src="images/header.png">
</div>
<form name="fMenu" id="fMenu" method="post" action="">
<input type="hidden" id="actmenu" name="actmenu">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr> 
    <td valign="top" colspan="2">
  
  <div>
    <ul class="jd_menu">
    
    
  <li><a href="ecuti.php">Home</a></li>
  <li>Proses&nbsp;<img src="images/down_m.gif">
    <ul>
    <li><a href="cuti.php">Pengajuan Cuti</a></li>
    <li><a href="setuju_cuti.php">Persetujuan Cuti</a></li>
    <li id="pic" style="display:none;"><a href="batal_cuti.php">Pembatalan Cuti</a></li>
    
    </ul>
  </li>
  <li id="pic2" style="display:none;">Pengaturan&nbsp;<img src="images/down_m.gif">
    <ul>
    <li><a href="libur.php">Hari Libur dan Cuti Bersama</a></li>
    <li><a href="tunda.php">Penundaan Cuti</a></li>
    </ul>
  </li>
  <li>Laporan&nbsp;<img src="images/down_m.gif">
    <ul>
    <li>Pegawai&nbsp;<img src="images/left_m.gif">
      <ul>
      <li><a href="form.php">Formulir Pengajuan Cuti</a></li>
      <li><a href="data_kartu.php">Kartu Cuti</a></li>
      </ul>
    </li>
    <li id="pic3" style="display:none;">Kepegawaian&nbsp;<img src="images/left_m.gif">
      <ul>
      <li><a href="list_pegawai.php">Daftar Pegawai Cuti</a></li>
      <li><a href="data_rekap.php">Rekapitulasi Cuti</a></li>
      <li>Kartu Cuti&nbsp;<img src="images/left_m.gif">
          <ul>
              <li><a href="kartu_cuti.php">RUH Kartu Cuti</a></li>
              <li><a href="input_kartu.php">Input Cuti</a></li>
          </ul> 
      </li>
      <li><a href="cuti_ln.php">Proses Cuti Luar Negeri</a></li>
    </li>
    </ul>
    </li>
    </ul>    
      <li><font color="yellow">Keluar </font><img src="images/down_m.gif">
        <ul>
          <li><a href="portal.php">Kembali ke Menu</a></li>
          <li><a href="logout.php"><font color="yellow">Logout</font></a></li>
        </ul>
      </li>
    </ul>
  </div>
  </td>
</tr>
<tr height="20" style="font-family: sans-serif, Tahoma; background-color:#ece9d8;">
  <td nowrap style="padding-left:5" id="tanggal">
    
  </td>
    <td align="right" nowrap style="padding-right:5;color:#666;padding-right:10px">
      <b>User ID: </b><span id="nip"></span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;     
  
  
   <b>Unit: </b><span id="unit"></span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;

  <b>Jabatan: </b><span id="jabatan"></span> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;

  </td>
  
</tr>
</table>
</form>
<script language="JavaScript">

function do_changeRoles() 
{
  document.getElementById("sJur").value = ""; 
  document.getElementById("actmenu").value = "changeRole"; 
  document.getElementById("fMenu").submit();
}

</script>

<div align="center">
  <table width="700">
  <tr height="30">
    <td align="center" colspan="2" class="PageTitle">RUH PENGARTUAN CUTI</td>
  </tr>
</table>
<table width="100">
  <tr>
  <td align="center">
    <a href="javascript:goInput();" id="inputButton" class="buttonshort"><span class="add">Kartukan</span></a>
  </td>
  <td align="center">
    <a href="javascript:goUbah();" id="ubahButton" class="buttonshort"><span class="print">Ubah</span></a>
  </td>
  <td align="center">
    <a href="javascript:goSave();" id="saveButton" class="buttonshortdis"><span class="save">Simpan</span></a>
  </td>
  <td align="center">
    <a href="javascript:goUndo();" id="undoButton" class="buttonshortdis"><span class="misc">Batalkan</span></a>
  </td>
</tr>
</table>
<br>
<table width="300">
  <tr>
    <td align="center">
<div style="display:none;text-align:left;border:1px solid #777;margin-top:10px;padding:5px" id="div_error">
      <div style="font-size:14px;color:red" id="error"></div>
</div>
</td>
  <td align="center">
<div style="display:none;text-align:left;border:1px solid #777;margin-top:10px;padding:5px" id="div_sukses">
      <div style="font-size:14px;color:green" id="sukses"></div>
</div>
</tr>
</td>
</table>
<div  class="tab-pane" id="showForm" style="display:block;width:75%"; onClick="doTest('show');">
    <div class="tab-page" >
      <h2 class="tab">Daftar Cuti Belum Dikartukan</h2>      
      <table width="100%" cellspacing=0 cellpadding="4" class="DetailStyle" id="list_belum_dikartu">
        <thead>
        <tr>
      <td colspan="7" class="SubHeaderBGAlt">Cuti Belum Dikartukan</td>
      </tr>
      
      <tr> 
        <td class="DataLabel" width="10%">NIP</td>
        <td class="DataLabel" width="15%">Nama</td>
        <td class="DataLabel" width="10%">Tanggal Pengajuan</td>
        <td class="DataLabel" width="15%">Tanggal Cuti</td>
        <td class="DataLabel" width="5%">Jumlah Hari</td>
        <td class="DataLabel" width="10%">Jenis Cuti</td>
        <td class="DataLabel" width="2%">Pilih</td>
        </tr>
        </thead>
        <form>
      <tbody>
      
    </tbody>
  </form>
     </table>
   </div>
   <div class="tab-page" >
      <h2 class="tab">Daftar Cuti Sudah Dikartukan</h2>      
      <table width="100%" cellspacing=0 cellpadding="4" class="DetailStyle" id="list_sudah_dikartu">
        <thead>
        <tr>
      <td colspan="7" class="SubHeaderBGAlt">Cuti Sudah Dikartukan</td>
      </tr>
      
      <tr> 
        <td class="DataLabel" width="10%">NIP</td>
        <td class="DataLabel" width="15%">Nama</td>
        <td class="DataLabel" width="10%">Tanggal Pengajuan</td>
        <td class="DataLabel" width="15%">Tanggal Cuti</td>
        <td class="DataLabel" width="5%">Jumlah Hari</td>
        <td class="DataLabel" width="10%">Jenis Cuti</td>
        <td class="DataLabel" width="2%">Pilih</td>
        </tr>
        </thead>
        <form>
      <tbody>
      
    </tbody>
  </form>
     </table>
   </div>
</div>

<div class="tab-pane" id="editForm" style="display:none; z-index:0; width:35%;" onClick="doTest('edit');">
<div class="tab-page">
  <h2 class="tab">Ubah Kartu Cuti</h2>
  <form method="post" id="frm_kartu" action="" name="frm_kartu">
    <table width="100%" cellspacing=0 cellpadding="4" class="DetailStyle" id="input_cuti">
        <tr>
      <td colspan="2" class="SubHeaderBGAlt">Detail Cuti Pegawai</td>
      </tr>
      <tr> 
      <td class="DataLabel" width="25%">NIP</td>
      <td width="75%" id="nip_detail">NIP</td>
      </tr>
      <tr> 
      <td class="DataLabel" width="25%">Nama</td>
      <td width="75%" id="nama_detail">NIP</td>
      </tr>
      <tr> 
      <td class="DataLabel" width="25%">Tanggal Cuti</td>
      <td width="75%" id="tgl_detail">NIP</td>
      </tr>
      <tr> 
      <td class="DataLabel" width="25%">Jenis Cuti</td>
      <td width="75%" id="jns_detail">NIP</td>
      </tr>
     </table>
    <table width="100%" border="0" cellspacing=0 cellpadding="4" class="DetailStyle" bgcolor="#e2f1fa" id="input_cuti">
     <tr>
      <td colspan="2" class="SubHeaderBGAlt">Form Kartu Cuti</td>
      </tr>
      <tr> 
      <td>Tanggal Surat</td>
      <td >
        <input name="tgl_surat" id="tgl_surat" type="text" class="ControlStyle" size="30" maxlength="10">
        <img src="images/img.gif" id="btn_awal" style="cursor:pointer;border:1px solid #ffbf00;" title="Pilih tanggal" onMouseOver="this.style.background='#ffbf00';" onMouseOut="this.style.background=''">
        <script type="text/javascript">
          Calendar.setup({
            inputField     :    "tgl_surat",
            ifFormat       :    "%d-%m-%Y",
            button         :    "btn_awal",
            align          :    "Tl",
            singleClick    :    true
          });
        </script>          
           </td>
      </tr>
     <tr> 
      <td>Nomor Surat</td>
      <td ><input type="text" name="nomor_surat" id="nomor_surat" class="ControlStyle" size="32"/></td>
      </tr>
      
     </table>
     </div>  
     <input type="hidden" id="frm_aksi" name="frm_aksi"/>
     <input type="hidden" id="id_aksi" name="id_aksi"/>
     <input type="hidden" id="id_cuti" name="id_cuti"/>

     <tr>
        <td colspan="2"><input type="submit" id="btn_simpan" class="ControlStyle" size="22" style="display: none;"/></td>
      </tr>
   </form>
      
   <script type="text/javascript" src="js/input_kartu.js"></script>
</div>
</div>
</body>
</html>

<script type="text/javascript">

function cekInput() {
  if(document.getElementById("tgl_surat").value==="" || document.getElementById("nomor_surat").value==="" ) {
    alert("Mohon isi semua isian.");
    document.getElementById("editForm").tabPane.setSelectedIndex(0);
    document.getElementById("tgl_surat").focus();
  }else{
    return true;
  }
  return false;
}

function goUndo() {
  if (document.getElementById("undoButton").className === "buttonshort") {
    document.getElementById("tgl_surat").value = "";
    document.getElementById("nomor_surat").value = "";
    document.getElementById("frm_aksi").value = "";
    document.getElementById("editForm").style.display = (document.getElementById("editForm").style.display==="none" ? "block" : "none");
    document.getElementById("showForm").style.display = (document.getElementById("showForm").style.display==="none" ? "block" : "none");
    if (document.getElementById("editForm").style.display==="none") {
      document.getElementById("inputButton").className = "buttonshort";
      document.getElementById("ubahButton").className = "buttonshort";
      document.getElementById("undoButton").className = "buttonshortdis";
      document.getElementById("saveButton").className = "buttonshortdis";
    }
  }
}

function goAdd(){
  if (document.getElementById("inputButton").className === "buttonshort") {
    document.getElementById("editForm").style.display = (document.getElementById("editForm").style.display==="none" ? "block" : "none");
    document.getElementById("showForm").style.display = (document.getElementById("showForm").style.display==="none" ? "block" : "none");
    document.getElementById("frm_aksi").value = "save";
    if (document.getElementById("editForm").style.display!=="none") {
      document.getElementById("inputButton").className = "buttonshortdis";
      document.getElementById("ubahButton").className = "buttonshortdis";
      document.getElementById("undoButton").className = "buttonshort";
      document.getElementById("saveButton").className = "buttonshort";
    }
  }
}

function goSave() {
  if (document.getElementById("saveButton").className!=="DisabledButton") {
    if(cekInput()) {
      //document.getElementById("frm_aksi").value = "save";
      $("#btn_simpan").trigger('click');
    }
  }
}

function goInput() {
  var isChecked = $("input:checked").val();
  if(typeof isChecked!=='undefined'){
      var str= isChecked.split(",");
      if(str[1]==="belum"){
        document.getElementById("frm_aksi").value = "input";
        document.getElementById("id_cuti").value = isChecked;
        $("#btn_simpan").trigger('click');
      }else{
        alert("Input Cuti Ke Kartu hanya cuti yang belum dikartukan");
      }
      
  }else{
    alert("Pilih Item Yang Akan di Ubah Terlebih Dahulu");
  }  
}
function goUbah() {
  var isChecked = $("input:checked").val();
  if(typeof isChecked!=='undefined'){
      var str= isChecked.split(",");
      if(str[1]==="sudah"){
        document.getElementById("frm_aksi").value = "ubah";
        document.getElementById("id_cuti").value = isChecked;
        $("#btn_simpan").trigger('click');
      }else{
        alert("Ubah Kartu hanya cuti yang sudah dikartukan");
      }
      
  }else{
    alert("Pilih Item Yang Akan di Ubah Terlebih Dahulu");
  }  
}

function doTest(id) {
  if(id==='show')
    document.getElementById("editForm").tabPane.setSelectedIndex(document.getElementById("showForm").tabPane.getSelectedIndex());
  else if(id==='edit')
    document.getElementById("showForm").tabPane.setSelectedIndex(document.getElementById("editForm").tabPane.getSelectedIndex());
}


</script>